<!DOCTYPE html>
<html lang="en" class="app">

<head>
    {include file="public:head_file"/}

</head>

<body class="">
<section class="vbox">
    {include file="public:header"/}
    <section>
        <section class="hbox stretch">
            {include file="public:slidemenu"/}
            <section id="content">
                <section class="hbox stretch">
                    <section class="vbox">
                        <section class="w-f-md" style="overflow: auto" id="container">

                        </section>
                        {include file="public:player"/}
                    </section>
                </section>
                <a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen,open"
                   data-target="#nav,html"></a>
            </section>
        </section>
    </section>



    <div class="modal fade" id="singerModel" tabindex="-1" role="dialog" aria-labelledby="singerModelLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="singerModelLabel"></h4>
                </div>
                <div class="modal-body">
                    <div  class="modal-img" style="text-align: center;border-bottom: 1px solid #e5e5e5;">
                        <img id="singerModelImg" src="" alt="对不起暂无图片">
                    </div>
                    <div id="singerModalIntro" class="modal-intro" style="text-indent: 28px;font-size: 20px;border-bottom: 1px solid #e5e5e5;" >
                        暂无数据
                    </div>
                    <div class="MusicList list-group list-group-lg no-radius no-border no-bg m-t-n-xxs m-b-none auto">
                            音乐列表
                        <ul id="singerModelMusics">

                        </ul>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>


    <div class="modal fade" id="createPlayListModal" tabindex="-1" role="dialog" aria-labelledby="createPlayListModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="createPlayListModalLabel">创建歌单</h4>
                </div>
                <div class="modal-body">
                    <form id="createPLForm" onsubmit="return false;" action="#" method="get">
                        <div class="form-group">
                            <label>歌单名：</label>
                            <input id="input_Pname" type="text" class="form-control" placeholder="请输入歌单名">
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" onclick="query_CreatePlayList()">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>


    <div class="modal fade" id="musicModal" tabindex="-1" role="dialog" aria-labelledby="musicModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="musicModalLabel">歌名--歌手名</h4>
                </div>
                <div class="modal-body">
                    <div class="modal-img" style="text-align: center;border-bottom: 1px solid #e5e5e5;padding-bottom: 10px">
                        <img id="musicModalImg" src="__STATIC__/images/256_256/123.jpg" alt="对不起暂无图片">
                    </div>
                    <div class="MusicList list-group list-group-lg no-radius no-border no-bg m-t-n-xxs m-b-none auto" style="margin-right: 3px; max-height: 150px;">
                        歌词
                        <pre id="musicModalLrc" style="overflow-x: hidden; overflow-y:auto; word-break: break-all;max-height: 150px;padding-left: 2em;padding-right: 2em">

                        </pre>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="addPLModal" tabindex="-1" role="dialog" aria-labelledby="addPLModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="addPLModalLabel">歌曲名</h4>
                </div>
                <div class="modal-body">
                    <input type="hidden" id="addPLModalMid">
                    <label class="col-xs-4 control-label">添加至歌单</label>
                    <div>
                        <select id="addPLModalPidList" name="pid" class="form-control m-b">
                        </select>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" onclick="addToPL()">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="editUserModal" tabindex="-1" role="dialog" aria-labelledby="editUserModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="editUserModalLabel">请选择</h4>
                </div>
                <div class="modal-body">
                    <button type="button" class="btn btn-default" onclick="selectModal_Password_Info(0)">修改密码</button>
                    <br><br>
                    <button type="button" class="btn btn-default" onclick="selectModal_Password_Info(1)">修改个人信息</button>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="editPassModal" tabindex="-1" role="dialog" aria-labelledby="editPassModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="editPassModalLabel">修改密码</h4>
                </div>
                <div class="modal-body form-horizontal">
                    <div class="row row-sm form-group">
                        <label class="col-xs-4 col-sm-2 control-label">原密码：</label>
                        <div class="col-xs-6 col-sm-8">
                            <input id="yuanPass" class="form-control rounded" type="password">
                        </div>
                    </div>
                    <div class="row row-sm form-group">
                        <label class="col-xs-4 col-sm-2 control-label">新密码：</label>
                        <div class="col-xs-6 col-sm-8">
                            <input id="newPass" class="form-control rounded" type="password">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" onclick="changePass()">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="editInfoModal" tabindex="-1" role="dialog" aria-labelledby="editInfoModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="editInfoModalLabel">修改个人信息</h4>
                </div>
                <div class="modal-body">
                    <form id="infoForm" method="post" action="{:url('login/editInfo')}"  class="form-horizontal" enctype="multipart/form-data">
                        <div class="row row-sm form-group">
                            <label class="col-xs-4 col-sm-2 control-label">昵称：</label>
                            <div class="col-xs-6 col-sm-8">
                                <input name="nickname" class="form-control rounded" type="text">
                            </div>
                        </div>
                        <div class="row row-sm form-group">
                            <label class="col-xs-4 col-sm-2 control-label">介绍：</label>
                            <div class="col-xs-6 col-sm-8">
                                <input name="info" class="form-control rounded" type="text">
                            </div>
                        </div>
                        <div class="row row-sm form-group">
                            <label class="col-xs-4 col-sm-2 control-label">头像：</label>
                            <div class="col-xs-6 col-sm-8">
                                <input name="hpic" class="form-control rounded" type="file">
                            </div>
                        </div>
                        <div class="row row-sm right text-right">
                            <div class="col-xs-4 col-sm-3">
                                <button type="submit" class="btn btn-success" >确定</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</section>
{include file="public:footer"/}
</body>
<script>
    var states=-1;
    var oContent=new Array();
    var states_flag=new Array(false,false,false,false,false,false);

    var myPlaylist=null;

    var musiclist_current=1;
    var singerslist_current=1;

    $(document).ready(function () {
        checkLogin();
        changeColorLayout(0);
        myPlaylist = new jPlayerPlaylist({
            jPlayer: "#jplayer_N",
            cssSelectorAncestor: "#jp_container_N"
        }, null, {
            playlistOptions: {
                enableRemoveControls: true,
                autoPlay: true
            },
            swfPath: "js/jPlayer",
            supplied: "webmv, ogv, m4v, oga, mp3",
            smoothPlayBar: true,
            keyEnabled: false,
            audioFullScreen: false
        });

        $(document).on($.jPlayer.event.pause, myPlaylist.cssSelector.jPlayer,  function(){
            $('.musicbar').removeClass('animate');
            $('.jp-play-me').removeClass('active');
            $('.jp-play-me').parent('li').removeClass('active');
        });

        $(document).on($.jPlayer.event.play, myPlaylist.cssSelector.jPlayer,  function(){
            $('.musicbar').addClass('animate');
        });

        $(document).on('click', '.jp-play-me', function(e){
            e && e.preventDefault();
            var $this = $(e.target);
            if (!$this.is('a')) $this = $this.closest('a');

            $('.jp-play-me').not($this).removeClass('active');
            $('.jp-play-me').parent('li').not($this.parent('li')).removeClass('active');

            $this.toggleClass('active');
            $this.parent('li').toggleClass('active');
            if( !$this.hasClass('active') ){
                myPlaylist.pause();
            }else{
                var i = Math.floor(Math.random() * (1 + 6 - 1));
                myPlaylist.play(i);
            }

        });

        $(document).on('click','.pushLoveList',function () {
            var mid=$(this).attr('data-mid');
            var that=this;
            $.ajax({
                url:"{:url('index/setLoveList')}",
                data:{
                    mid:mid
                },
                method:'GET',
                dataType:'json',
                success:function(data) {
                    if(data.state==1){
                        states_flag[states]=true;
                        if(data.love==true)
                            $(that).addClass('active');
                        else
                            $(that).removeClass('active');
                    }
                    else if(data.state==2)
                    {
                        alert('请登录。');
                    }
                    else
                    {
                        alert('数据库修改失败。');
                    }

                },
                error:function(e)
                {
                    alert('操作失败，服务器出现问题');
                }
            });
        });


        // video

        // $("#jplayer_1").jPlayer({
        //     ready: function () {
        //         $(this).jPlayer("setMedia", {
        //             title: "Big Buck Bunny",
        //             m4v: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.m4v",
        //             ogv: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.ogv",
        //             webmv: "http://flatfull.com/themes/assets/video/big_buck_bunny_trailer.webm",
        //             poster: "images/m41.jpg"
        //         });
        //     },
        //     swfPath: "js",
        //     supplied: "webmv, ogv, m4v",
        //     size: {
        //         width: "100%",
        //         height: "auto",
        //         cssClass: "jp-video-360p"
        //     },
        //     globalVolume: true,
        //     smoothPlayBar: true,
        //     keyEnabled: true
        // });
    });



    function refresh()
    {
        switch (states)
        {
            case 0:query_index(true);break;
            case 1:query_Genres(true);break;
            case 2:query_Singers(true);break;
            case 3:query_Lists(true);break;
            case 4:query_Videos(true);break;
            case 5:query_PersonCenter(true);break;
            default:
                break;
        }
    }





    function resetColor()
    {
        $('#nav').removeClass('bg-dark');
        $('#nav').removeClass('bg-black');
        $('#navbar').removeClass('bg-black lter');
        $('#navbar').removeClass('bg-white-only');
        $('#navbar-header').removeClass('bg-info');
        $('#navbar-header').removeClass('bg-success');
        $('#player').removeClass('bg-info dker');
        $('#player').removeClass('bg-dark');
        $('#player').removeClass('bg-success');
    }

    function addList_play(id,flag=true)
    {
        $.ajax({
            url:"{:url('index/getMusicByMid')}",
            type:"get",
            data:{
                mid:id
            },
            success:function(data)
            {
                addPlayList(data.mname,data.sname,data.file,flag);
            },
            error:function()
            {

            },
            dataType: "json"
        });
    }

    function play_PL(obj)
    {
        var pid=$(obj).attr('data-pid');
        console.log(pid);
        $.ajax({
            url:"{:url('lists/getPLDetail')}",
            data:{
                pid:pid
            },
            dataType:'json',
            success(data){
                console.log('play:');
                console.log(data);
                if(data.length==0)
                    alert('对不起，该歌单为空。');
                else
                {
                    myPlaylist.pause();
                    myPlaylist.remove();
                    for(var i=0;i<data.length;i++)
                    {
                        var music=data[i];
                        myPlaylist.add({
                            title:music['mname'],
                            artist:music['sname'],
                            mp3:"http://localhost/Musik/public/static/MP3/"+music['file']
                        },true);
                    }
                }
            }
        })
    }

    function query_SildePlayList()
    {
        $.ajax({
           url:"{:url('index/getSlidePlayList')}",
            type:'post',
            dataType:'json',
            success:function(data)
            {
                $('#SlidePlayList').html('<li class="hidden-nav-xs padder m-t m-b-sm text-xs text-muted">\n' +
                    '                            <span class="pull-right"><a onclick="show_CreatePLModal()"><i class="icon-plus i-lg"></i></a></span>\n' +
                    '                            Playlist\n' +
                    '                        </li>');
                if(data['status'])
                {
                    if(data['info'])
                    {
                        data['info'].forEach(function(e)
                        {
                            $('#SlidePlayList').append('<li>\n' +
                                '                            <a href="javascript:void(0);"  onclick="play_PL(this)" data-pid="'+e['pid']+'">\n' +
                                '                                <i class="icon-music-tone icon"></i>\n' +
                                '                                <span>'+e['pname']+'</span>\n' +
                                '                            </a>\n' +
                                '                        </li>');
                        });
                    }
                    else
                        $('#SlidePlayList').append('<li>\n' +
                            '                            <a href="#">\n' +
                            '                                <span>暂无数据</span>\n' +
                            '                            </a>\n' +
                            '                        </li>');
                }
                else
                    $('#SlidePlayList').append('<li>\n' +
                        '                            <a href="#">\n' +
                        '                                <span>尚未登录</span>\n' +
                        '                            </a>\n' +
                        '                        </li>');
            },
            error:function()
            {
                console.log('网络访问受限')
            }
        });
    }

    function query_Genres_con(page=1,tid=-1,pos=-1)
    {
        $.ajax({
           url:"{:url('genres/getCon_Genres')}",
           type:'get',
           data:{
               page:page,
               tid:tid
           },
            success:function(data)
            {
                $('#genres_content').html(data);
                if(page!=-1 && page!=-2)
                {
                    musiclist_current=page;
                    $('#pages li').removeClass('active');
                    $('#pages li').eq(musiclist_current).addClass('active');
                }
                else
                {
                    var numm=$('#page li').length;
                    if(page==-2)
                    {
                        musiclist_current=(musiclist_current-1>0?musiclist_current-1:1);
                    }
                    else
                    {
                        musiclist_current=(musiclist_current+1>numm-2?numm-2:musiclist_current+1);
                    }
                    $('#pages li').removeClass('active');
                    $('#pages li').eq(musiclist_current).addClass('active');
                }
            },
            dataType:'html'
        });

        if(pos!=-1) {
            $('#genres_slide a').removeClass('active');
            $('#genres_slide a').eq(pos).addClass('active');
        }
    }


    function query_index(flag=false)
    {
        if(states==0 && !flag)
            return;
        if((oContent[0]==null) || flag || states_flag[0])
        {
            $.ajax({
                url:"{:url('index/getContent')}",
                type:"post",
                data:null,
                success:function(data)
                {
                    oContent[0]=data;
                    $('#container').html(data);
                    states_flag[0]=false;
                },
                error:function()
                {
                    if(oContent[0]==null)
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[0]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[0]);
        }
        states=0;
    }

    function query_Genres(flag=false)
    {
        if(states==1 && !flag)
            return;
        if((oContent[1]==null) || flag  || states_flag[1])
        {
            $.ajax({
                url:"{:url('genres/getContent')}",
                type:"post",
                data:null,
                success:function(data)
                {
                    oContent[1]=data;
                    $('#container').html(data);
                    states_flag[1]=false;
                    query_Genres_con(1,0);
                },
                error:function()
                {
                    if(oContent[1]==null)
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[1]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[1]);
            query_Genres_con(1,0);
        }
        states=1;
    }

    function query_Singers_con(page=1,sid=0,pos=-1)
    {
        $.ajax({
            url:"{:url('singers/getCon_Singers')}",
            type:'get',
            data:{
                page:page,
                sid:sid
            },
            success:function(data)
            {
                $('#genres_content').html(data);
                if(page!=-1 && page!=-2)
                {
                    singerslist_current=page;
                    $('#pages li').removeClass('active');
                    $('#pages li').eq(singerslist_current).addClass('active');
                }
                else
                {
                    var numm=$('#page li').length;
                    if(page==-2)
                    {
                        singerslist_current=(singerslist_current-1>0?singerslist_current-1:1);
                    }
                    else
                    {
                        singerslist_current=(singerslist_current+1>numm-2?numm-2:singerslist_current+1);
                    }
                    $('#pages li').removeClass('active');
                    $('#pages li').eq(singerslist_current).addClass('active');
                }
            },
            dataType:'html'
        });

        if(pos!=-1) {
            $('#genres_slide a').removeClass('active');
            $('#genres_slide a').eq(pos).addClass('active');
        }
    }

    function query_Singers(flag=false)
    {
        if(states==2 && !flag)
            return;
        if((oContent[2]==null) || flag || states_flag[2])
        {
            $.ajax({
                url:"{:url('singers/getContent')}",
                type:"post",
                data:null,
                success:function(data)
                {
                    oContent[2]=data;
                    $('#container').html(data);
                    states_flag[2]=false;
                    query_Singers_con();
                },
                error:function()
                {
                    if(oContent[2]==null)
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[2]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[2]);
            query_Singers_con();
        }
        states=2;
    }

    function query_Lists(flag=false)
    {
        if(states==3 && !flag)
            return;
        if((oContent[3]==null) || flag || states_flag[3])
        {
            $.ajax({
                url:"{:url('lists/getContent')}",
                type:"post",
                data:null,
                success:function(data)
                {
                    oContent[3]=data;
                    $('#container').html(data);
                    states_flag[3]=false;
                },
                error:function()
                {
                    if(oContent[3]==null)
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[3]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[3]);
        }
        states=3;
    }

    function query_Videos(flag=false)
    {
        if(states==4 && !flag)
            return;
        if((oContent[4]==null) || flag || states_flag[4])
        {
            $.ajax({
                url:"{:url('video/getContent')}",
                type:"post",
                data:null,
                success:function(data)
                {
                    oContent[4]=data;
                    $('#container').html(data);
                    states_flag[4]=false;
                },
                error:function()
                {
                    if(oContent[4]==null)
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[4]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[4]);
        }
        states=4;
    }

    function query_PersonCenter(flag=false)
    {
        if(states==5 && !flag)
            return;
        if((!oContent[5]) || flag || states_flag[5])
        {
            $.ajax({
                url:"{:url('index/getPersonInfo')}",
                type:"post",
                data:{
                    uid:sessionStorage.getItem('uid')
                },
                success:function(data)
                {
                    oContent[5]=data;
                    $('#container').html(data);
                    states_flag[5]=false;
                },
                error:function()
                {
                    if(!oContent[5])
                        $('#container').html('网络访问受限');
                    else
                        $('#container').html(oContent[5]);
                },
                dataType: "html"
            });
        }
        else
        {
            $('#container').html(oContent[5]);
        }
        states=5;


    }

    function changeColorLayout(i=0)
    {
        resetColor();
        query_SildePlayList();
        $('#player').show();
// case 'Genres': echo'';  case 'Index': echo 'bg-dark';break;case 'Lists': case 'Video' : echo 'bg-black'; break; default :  echo 'bg-black';break;
// case 'Genres': echo'';  case 'Index': echo 'bg-white-only';break;case 'Lists': case 'Video' : echo 'bg-black lter'; break; default :  echo 'bg-white-only';break;
// case 'Genres': echo'';  case 'Index': echo 'bg-info';break;case 'Lists': case 'Video' : echo 'bg-success'; break; default :  echo 'bg-info';break;
// case 'Genres': echo'bg-info dker'; break;  case 'Index': echo 'bg-dark';break;case 'Lists': echo 'bg-success dker';break; default :  echo 'bg-dark';break;
        switch (i)
        {
            case 0:
                $('#nav').addClass('bg-dark');
                $('#navbar').addClass('bg-white-only');
                $('#navbar-header').addClass('bg-info');
                $('#player').addClass('bg-dark');
                $('title').html("Musik | Index");
                query_index();
                break;
            case 1:
                $('#nav').addClass('bg-dark');
                $('#navbar').addClass('bg-white-only');
                $('#navbar-header').addClass('bg-info');
                $('#player').addClass('bg-info dker');
                $('title').html("Musik | Gendres");
                query_Genres();
                break;
            case 2:
                $('#nav').addClass('bg-black');
                $('#navbar').addClass('bg-black lter');
                $('#navbar-header').addClass('bg-info');
                $('#player').addClass('bg-success');
                $('title').html("Musik | Singers");
                query_Singers();
                break;
            case 3:
                $('#nav').addClass('bg-black');
                $('#navbar').addClass('bg-black lter');
                $('#navbar-header').addClass('bg-success');
                $('#player').addClass('bg-success dker');
                $('title').html("Musik | PlayList");
                query_Lists();
                break;
            case 4:
                $('#nav').addClass('bg-black');
                $('#navbar').addClass('bg-black lter');
                $('#navbar-header').addClass('bg-success');
                $('title').html("Musik | Videos");
                $('#player').hide();
                query_Videos();
                break;
            case 5:
                $('#nav').addClass('bg-dark');
                $('#navbar').addClass('bg-white-only');
                $('#navbar-header').addClass('bg-success');
                $('title').html("Musik | Videos");
                $('#player').hide();
                query_PersonCenter();
                break;
            default:
                $('#nav').addClass('bg-dark');
                $('#navbar').addClass('bg-white-only');
                $('#navbar-header').addClass('bg-info');
                $('#player').addClass('bg-dark');
                query_index();
                break;
        }
    }

    function addPlayList(titie,artist,mp3_name,flag=true)
    {
        if(flag)
            myPlaylist.pause();
        myPlaylist.add({
            title:titie,
            artist:artist,
            mp3:"http://localhost/Musik/public/static/MP3/"+mp3_name,
        },flag);
    }

    function checkLogin() {
        $.ajax({
            url:"{:url('login/getLoginStates')}",
            type:"post",
            data:null,
            success:function(data)
            {
                if(data.state==1)
                {
                        sessionStorage.setItem('uid',data.uid);
                        $('#aLogin').html('<span class="thumb-sm avatar pull-right m-t-n-sm m-b-n-sm m-l-sm">\n' +
                        '\t                <img src="__STATIC__/headcut/'+data.pic+'" alt="...">\n' +
                        '\t              </span>\n' +
                        '\t              '+data.name+' <b class="caret"></b>');

                        $('#aLogin').addClass('dropdown-toggle bg clear');
                        $('#aLogin').attr('href','#');
                        $('#aLogin').attr('data-toggle','dropdown');

                        $('#aLogin_Slide').html('<span class="thumb-sm avatar pull-left m-l-xs">                        \n' +
                            '                        <img src="__STATIC__/headcut/'+data.pic+'" class="dker" alt="...">\n' +
                            '                      </span>\n' +
                            '                      <span class="hidden-nav-xs clear">\n' +
                            '                        <span class="block m-l">\n' +
                            '                          <strong class="font-bold text-lt">'+data.name+'</strong> \n' +
                            '                          <b class="caret"></b>\n' +
                            '                        </span>\n' +
                            '                        <span class="text-muted text-xs block m-l">'+data.uname+'</span>\n' +
                            '                      </span>');
                }
                else
                {
                    $('#aLogin_Slide').html('');
                    $('#aLogin').html('登陆');

                    $('#aLogin').removeClass('dropdown-toggle bg clear');
                    $('#aLogin').attr('href',"{:url('login/index')}");
                    $('#aLogin').removeAttr('data-toggle');
                    query_index();
                }
            },
            error:function()
            {
                alert('网络访问失败。');
            },
            dataType: "json"
        });
    }

    function logout()
    {
        $.ajax({
            url:"{:url('login/logout')}",
            success:function(data)
            {
                sessionStorage.removeItem('uid');
                checkLogin();
            },
            error:function()
            {
                alert("注销失败");
            },
        });
    }

    function showSinger(sid)
    {
        $.ajax({
            url:"{:url('singers/getSinger')}",
            type: "get",
            data:{
                sid:sid
            },
            dataType: "json",
            success:function(data)
            {
                $('#singerModalIntro').html('');
                $('#singerModelMusics').html('');
                $('#singerModelLabel').html('歌手：'+data['singer']['sname']);
                $('#singerModelImg').attr('src','__STATIC__/images/400_200/123.jpg');
                if(data['singer']['intro'])
                    $('#singerModalIntro').html(data['singer']['intro']);
                else
                    $('#singerModalIntro').html('暂无数据');
                if(data['musiclist'])
                    for(let index in data['musiclist'])
                    {
                        var music=data['musiclist'][index];
                        $('#singerModelMusics').append('<li class="list-group-item">' +
                                                        '<img src="__STATIC__/images/128_128/'+music['poster']+'" alt="" style="height: 30px;width: 30px;float: left;margin-right: 3px;">'+
                                                         '<div class="pull-right m-l">' +
                                                            '<a href="#" onclick="addList_play('+music['mid']+',true)" class="m-r-sm"><i class="icon-control-play"></i></a>' +
                                                            '<a href="#" onclick="addPL(this)" data-mid="'+music['mid']+'" data-mname="'+music['mname']+'" data-sname="'+data['singer']['sname']+'"  class="m-r-sm"><i class="icon-plus "></i></a>' +
                                                        '</div>' +
                                                        '<div class="clear text-ellipsis"  onclick="showMusic('+music['mid']+')">'+
                                                        '<span>'+music['mname']+'</span>'+
                                                         '<span class="text-muted"> -- '+music['duration']+'</span>' +
                                                        '</div>' +
                                                        '</li>');
                    }
                else
                {
                    $('#singerModelMusics').append('暂无数据');
                }

                $('#singerModel').modal('show');
            }
        });
    }


    function query_CreatePlayList()
    {
        var pname=$('#input_Pname').val();
        if(pname=='')
        {
            alert('歌单名不能为空');
            return;
        }
        else
        {
            $.ajax({
                url:"{:url('index/createPlayList')}",
                type:'get',
                data:{
                    pname:pname
                },
                dataType:'json',
                success:function(data){
                    switch (data['status'])
                    {
                        case 0:
                            alert('请登录');
                            break;
                        case 1:
                            alert('创建成功');
                            query_SildePlayList();
                            break;
                        case 2:
                            alert('数据库操作失败，请联系管理员');
                            break;
                        default:
                            break;
                    }
                    $('#createPlayListModal').modal('hide');
                },
                error:function()
                {
                    alert('网络访问受限');
                    $("#createPlayListModal").modal('hide');
                }
            });
        }
    }

    function show_CreatePLModal()
    {
        if(!sessionStorage.getItem('uid'))
        {
            alert('请登录');
            return;
        }
        $('#createPlayListModal').modal('show');
    }

    function showMusic(mid)
    {
        $.ajax({
           url:"{:url('index/getMusicByMid')}",
           type:'get',
           dataType:'json',
           data:{
               mid:mid
           },
           success:function (data) {
               $('#musicModalLabel').html(data['mname']+'--'+data['sname']);
               $('#musicModalImg').attr('src','__STATIC__/images/256_256/'+data['poster']);
               $('#musicModalLrc').html(data['lrc']);
               $('#musicModal').modal('show');
           }
        });
    }

    function addPL(that)
    {
        if(!sessionStorage.getItem('uid'))
        {
            alert('请登录');
            return;
        }
        $.ajax({
            url:"{:url('lists/getPlayListByUid')}",
            dataType:'json',
            success(data){
                if(data['status']==0)
                {
                    return;
                }
                $('#addPLModalLabel').html($(that).attr('data-mname')+" - - "+$(that).attr('data-sname'));
                var string='<option value="-1" selected="selected">我喜爱的歌</option>';
                if(data['length'])
                {
                    for(var i=0;i<data['length'];i++)
                    {
                        var s=data['result'][i];
                        string+='<option value="'+s['pid']+'">'+s['pname']+'</option>';
                    }
                }
                $('#addPLModalMid').attr('value',$(that).attr('data-mid'));
                $('#addPLModalPidList').html(string);
                $('#addPLModal').modal('show');
            },
            error(e){

            }
        });
    }

    function addToPL()
    {
        $.ajax({
           url:"{:url('lists/addToPL')}",
            data:{
               mid:$('#addPLModalMid').attr('value'),
                pid:$('#addPLModalPidList option:selected').val()
            },
            dataType:'json',
            success(data){
               $('#addPLModal').modal('hide');
           }
        });
    }

    function showPLDetail(that)
    {
        var pid=$(that).attr('data-pid');
        $.ajax({
            url:"{:url('lists/getPLDetail')}",
            data:{
                pid:pid
            },
            dataType:'json',
            success(data)
            {
                var html="";
                if(data.length==0)
                {
                    $('#PlayListSlide_Right').html('<li class="list-group-item clearfix">\n' +
                        '     <a class="clear" href="#">\n' +
                        '       <span class="block text-ellipsis">对不起暂无数据</span>\n' +
                        '     </a>\n' +
                        '  </li>');
                    return;
                }
                for(var i=0;i<data.length;i++)
                {
                    html+='<li class="list-group-item clearfix">\n' +
                        '     <a href="#" onclick="addList_play('+data[i]['mid']+')" class="jp-play-me pull-right m-t-sm m-l text-md">\n' +
                        '       <i class="icon-control-play"></i>\n' +
                        '     </a>\n' +
                        '     <a href="javascript:;" class="pull-left thumb-sm m-r">\n' +
                        '       <img src="__STATIC__/images/256_256/'+data[i]['poster']+'" alt="...">\n' +
                        '     </a>\n' +
                        '     <a class="clear" href="javascript:;" onclick="showMusic('+data[i]['mid']+')">\n' +
                        '       <span class="block text-ellipsis">'+data[i]['mname']+'</span>\n' +
                        '     </a>\n' +
                        '     <a class="clear" href="javascript:;" onclick="showSinger('+data[i]['sid']+')">\n' +
                        '       <small class="text-muted">by '+data[i]['sname']+'</small>\n' +
                        '     </a>\n'+
                        '  </li>';
                }
                $('#PlayListSlide_Right').html(html);
            }
        });
    }

    function showEditModal()
    {
        $.ajax({
            url:""
        });
        $("#editUserModal").modal("show");
    }

    function selectModal_Password_Info(code)
    {
        $('#editUserModal').modal('hide');
        switch (code){
            case 0:
                $('#editPassModal').modal('show');
                break;
            case 1:
                $('#editInfoModal').modal('show');
                break;
        }
    }

    function changePass()
    {
        var uid=window.sessionStorage.getItem('uid');
        var yuanPass=$('#yuanPass').val();
        var newPass=$("#newPass").val();
        $.ajax({
            url:"{:url('login/changePass')}",
            async:'false',
            data:{
                uid:uid,
                yuanpass:yuanPass,
                newpass:newPass
            },
            method:'post',
            dataType:"json",
            success(data){
                if(data['status'])
                    $('#editPassModal').modal('hide');
                else
                    alert(data['info']);
            }

        })
    }


    function deletePlayList(that,p)
    {
        if(p==0)
        {
            var pid=$(that).attr('data-pid');
            var mid=$(that).attr('data-mid');
            $.ajax({
                url:"{:url('index/deletePlayList')}",
                data:{
                    type:p,
                    pid:pid,
                    mid:mid
                },
                dataType:'json',
                success(data){
                    if(!data['status'])
                        alert('对不起，服务器内部出现错误');
                    refresh();
                    query_SildePlayList(true);
                }
            });
        }
        else
        {
            var pid=$(that).attr('data-pid');
            $.ajax({
                url:"{:url('index/deletePlayList')}",
                data:{
                    type:p,
                    pid:pid,
                },
                dataType:'json',
                success(data){
                    if(!data['status'])
                        alert('对不起，服务器内部出现错误');
                    refresh();
                    query_SildePlayList(true);
                }
            })
        }
    }

</script>

</html>